<template>
	<view class="box">
		<view class="withdraw-wrap">
			<view class="title">
				佣金将提现到余额
			</view>
			<view class="money-wrap">
				<view class="unit">
					￥
				</view>
				<view class="withdraw-money">
					<u-input v-model="money" :custom-style="{'font-size':'48rpx'}" placeholder="" />
				</view>
			</view>
			<view class="bootom">
				<text class="color-tip">可提现佣金：¥ {{ (available_withdraw / 100).toFixed(2) }}</text>
			</view>
		</view>
		<view class="desc">
			<text>最小提现金额为 ¥ {{ (lowest_withdraw).toFixed(2) }}</text>
		</view>
		
		<view class="apply-btn">
			<u-button type="error" shape="circle" @click="submitApply">提现到余额</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				money: '',
				available_withdraw: 0,
				lowest_withdraw: 0
			}
		},
		onShow() {
			this.getData()
		},
		onLoad() {
			uni.showLoading({})
		},
		methods:{
			submitApply(){
				const that = this;
				uni.showLoading({})
				this.$api.fenxiao.submitWithdrawApply({
					money:(this.money * 100)
				}).then(res => {
					uni.hideLoading()
					this.$u.toast('申请成功')
					setTimeout(function() {
						that.$myRouter.back();
					}, 1500);
				}).catch(err => {
					uni.hideLoading()
					this.$u.toast(err.message)
				})
			},
			getData(){
				this.$api.fenxiao.getMemberWithdraw().then(res => {
					uni.hideLoading()
					this.available_withdraw = res.available_withdraw
					this.lowest_withdraw = res.lowest_withdraw
				}).catch(err => {
					uni.hideLoading()
					this.$u.toast(err.message)
				})
			}
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #f8f8f8;
	}
	.withdraw-wrap{
		margin:10px 15px 0;
		padding:15px;
		border-radius:5px;
		background-color:#FFF;
		
		.title{
			font-size: 28rpx;
			color: #909399;
		}
		
		.money-wrap{
			padding:20rpx 0;
			border-bottom:0.5px solid #eee;
			display: flex;
			.unit{
				font-size:60rpx;
				line-height: 1;
			}
			.withdraw-money{
				height:60rpx;
				line-height: 1;
				min-height: 60rpx;
				padding-left: 20rpx;
				font-size: 60rpx;
			}
		}
		.bootom{
			padding-top: 30rpx;
			.color-tip{
				color: #909399;
			}
		}
	}
	.desc{
		margin: 20rpx 40rpx;
		font-size:24rpx;
		color: #909399;
	}
	.apply-btn{
		padding: 30rpx;
	}
</style>
